<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core">


    <h:head>

        <title>SHUCKAPP-Menu</title>
        <link rel="stylesheet" type="text/css" href="/Shuckapp/recursos/css/estilos.css" />

    </h:head>
    <f:metadata>
        <f:viewParam name="marker" value="#{restaurante.codigo}" />
    </f:metadata>
    <h:body>
        <p:graphicImage value="/recursos/imagenes/logo_shuckapp.png" width="200px"  height="100px"/>
        <span class="title">Que hay para comer?</span>
        <p:panel  styleClass="cuerpo">
            <h:form id="fr_menu">
                <p:stack icon="/recursos/imagenes/icon_menu.png" expanded="true" closeSpeed="30" id="menu">
                    <c:forEach items="#{bmenuInicio.menus}" var="link">
                        <p:menuitem  value="#{link.titulo}"  url="#{link.outcome} "  icon="#{link.icon}"    />  
                    </c:forEach>
                </p:stack>
                <p:draggable for="menu"  />     
            </h:form>
            <br /><br />
        </p:panel>
        <br />
    
        <p:growl id="msgs" showDetail="true" />
        <p:panel id="basic" header="ShuckApp - Menus" style="margin-bottom:20px; width:80%;">
            <h:form>
            <h:panelGroup >
                Seleccione un restaurante para ver los menus disponibles: &nbsp;
                <p:autoComplete id="dd" dropdown="true" value="#{bddlRestaurante.descripcion}"
                                immediate="true" 
                                onselect="#{bddlRestaurante.changeEvent()}"
                                completeMethod="#{bddlRestaurante.completeText}" />
                
            </h:panelGroup>
            </h:form>
            
            <h1 style="margin-top:0">#{restaurante.nombre}</h1>
            <h3 style="margin-top:0">Ubicación: #{restaurante.ubicacion}</h3>
            <p:dataTable var="horario" value="#{restaurante.horarios}" style="width: 250px">
                <f:facet name="header">
                    Horarios de atención
                </f:facet>
                <p:column>
                    #{horario}
                </p:column>
            </p:dataTable>
            <br />
            <p:panelGrid columns="2" id="pgMenu" style="width: 100%;">
                <p:dataTable var="menu" value="#{restaurante.menus}">
                    <f:facet name="header">
                        Menús
                    </f:facet>
                    <p:column>
                        <p:graphicImage value="#{menu.imagen}"/>
                    </p:column>
                    <p:column>
                        <h:outputLabel value="Nombre:" /> <br />
                        <h:outputLabel value="Precio:" /> <br />
                        <h:outputLabel value="Descripcion:" />
                    </p:column>
                    <p:column>
                        <h:outputLabel value="#{menu.titulo}" /> <br />
                        <h:outputLabel value="#{menu.precio}" /> <br />
                        <h:outputLabel value="#{menu.descripcion}" />
                    </p:column>
                </p:dataTable>
                
                <p:dataTable var="promo" value="#{restaurante.promociones}">
                    <f:facet name="header">
                        Ofertas y Promociones
                    </f:facet>
                    <p:column>
                        <p:graphicImage value="#{promo.imagen}"/>
                    </p:column>
                    <p:column>
                        <h:outputLabel value="Nombre:" /> <br />
                        <h:outputLabel value="Precio:" /> <br />
                        <h:outputLabel value="Descripcion:" />
                    </p:column>
                    <p:column>
                        <h:outputLabel value="#{promo.titulo}" /> <br />
                        <h:outputLabel value="#{promo.precio}" /> <br />
                        <h:outputLabel value="#{promo.descripcion}" />
                    </p:column>
                    
                </p:dataTable>
            </p:panelGrid>
            
        </p:panel>
    </h:body>

</html>
